<template>
  <div class="app-container">
    <el-col :span="12">
      <img src="@/images/gif_404.gif" alt="404" class="img-style">
    </el-col>
    <el-col :span="12">
      <div style="margin-left: 100px;margin-top: 60px">
        <h1 style="color: #0CABFF">OOPS!</h1>
        <h2 style="color: #606266">很抱歉，页面它不小心迷路了！</h2>
        <div style="color:#909399;font-size: 14px">请检查您输入的网址是否正确，请点击以下按钮返回主页或者发送错误报告</div>
        <el-button style="margin-top: 20px" type="primary" round @click="$router.push('/')">返回首页</el-button>
      </div>
    </el-col>
  </div>
</template>

<style scoped>
.app-container {
  width: 80%;
  margin: 120px auto;
}

.img-style {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}
</style>
